<template>
	<view class="service-progress-component">
		<view class="service-progress-content">
			<view class="service-progress-list">
				<view
					v-for="(item, index) in list"
					:key="index"
					class="service-progress-item"
				>
					<template v-if="item.placeholder">
						<view class="placeholder-icon"></view>
					</template>
					<template v-else>
						<image class="icon-image" :src="item.icon || item[selectRecycle.recycleKey].icon"></image>
						<text class="text">{{ item.text || item[selectRecycle.recycleKey].text }}</text>
					</template>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import { recycleOrderProcess } from '@/config'

export default {
	props: {
		selectRecycle: Object
	},
	data () {
		return {
			list: recycleOrderProcess
		}
	}
}
</script>

<style lang="scss" scoped>
@import './index.scss';
</style>